<template>
  <div class="mini1">
  	<span v-if="editing">
  		<Button icon="md-checkmark" type="success" @click="handleSave"></Button> &nbsp;
		<Button icon="md-close" type="error" @click="handleCancel"></Button>
  	</span>
  	<Button type="primary" custom-icon="iconfont icon-bianji" shape="circle" @click="handleEdit" v-else>编辑</Button>
  	
  	<br><br>
    <Input v-model="content" placeholder="Enter something..."  v-if="editing"/>
    <Alert type="warning" banner show-icon v-else>
		<template #icon><Icon custom="iconfont icon-laba"/></template>
		<marquee>{{content}}</marquee>
	</Alert>
  </div>
</template>
<script>
export default {
    data(){
    	return{
    		editing:false,
    		content:'Notice: notification contents...',
    		editContent:''
    	}
    },
    methods:{
    	handleSave(){
    		this.$axios.post("mainMini1SaveContent.action",{name:this.content}).then(res=>{
	   		   if(res.data=='suc'){
    			   this.$Message.success('修改成功')
    			   this.editing=false
    		   }else{		   
    			   this.$Message.error('修改失败'+res.data)
    		   }
        	})
    	},
    	handleEdit(){
    		this.editContent=this.content
    		this.editing = true
    	},
    	handleCancel(){
    		this.content=this.editContent
    		this.editing = false
    	}
    },
    mounted(){
    	this.$axios.get("mainMini1GetContent.action").then(res=>{
    		this.content=res.data.name
    	})
    }
}
</script>
<style scoped="scoped">
.mini1{
padding: 16px;
}
</style>